<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@include file="/common/taglibs.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<%@include file="/common/meta.jsp"%>
<%@include file="/common/validator.jsp"%>
</head>
<body>
<div class="x-panel">
<div class="x-panel-header" style="border-bottom: 1px solid #97B7E7;">项目分类管理</div>
<div align="center" style="margin-top: 5px;">
  <div style="width:600px;">
	<%@ include file="/common/messages.jsp"%>
  </div>
 <s:form id="saveProjectTypeForm" action="save.do" method="post" onsubmit="selectAll()" cssStyle="margin:auto;">
  <fieldset style="width:600px;">
    <legend>项目分类编辑</legend>
	    <s:hidden name="model.id" />
	    <table width="550" border="0" align="center" style="line-height: 25px;">
		  <tr>
			<td align="right" width="100">项目分类编码：</td>
			<td width="450">
			  <s:textfield id="code" name="model.code" cssStyle="width: 400px;" cssClass="required" maxlength="50"/>
			  <font color="red">&nbsp;*</font>
			</td>
		  </tr>
		  <tr>
		    <td align="right">项目分类名称：</td>
		    <td>
			  <s:textfield id="name" name="model.name" cssStyle="width: 400px;" cssClass="required" maxlength="50"/>
			  <font color="red">&nbsp;*</font>
		    </td>
		  </tr>
		  <c:if test="${param.isFinance eq 'true' }">
          <tr>
             <td colspan="2">
	             <table width="460" cellpadding="0" cellspacing="0">
		           <tr>
		             <td width="200" valign="bottom">
		               <select id="unSelectedItems" ondblclick="selectItem()" multiple="multiple" style="width:200px; height:380px; margin-bottom: -10px;">
		                 <s:iterator value="unSelectedItems" var="item">
		                   <option value="${item.id}">${item.code}&nbsp;${item.name}</option>
		                 </s:iterator>
		               </select>
		             </td>
		             <td width="60" align="center">
		               <input type="button" value="&gt;" class="button select" onclick="selectItem()"><br><br>
		               <br><br><br><br>
		               <input type="button" value="&lt;" class="button select" onclick="unSelectItem()"><br><br>
		             </td>
		             <td width="200">
		               <select id="selectedItems" ondblclick="unSelectItem()" name="selectedItemIds" multiple="multiple" style="width:200px; height:380px; margin-bottom: -10px;">
		                  <s:iterator value="model.items" var="item">
		                   <option value="${item.id}">${item.code}&nbsp;${item.name}</option>
		                 </s:iterator>
		               </select>
		             </td>
		           </tr>
		         </table>
             </td>
           </tr>
           </c:if>
		</table>
		<br>
	</fieldset>
	<div style="text-align: center;"><br>
	  <s:submit value="保存" 	cssClass="button" /> &nbsp;&nbsp;
	  <input type="button" value="返回" class="button" onclick="javascript:history.back();">
	</div>
  </s:form>
</div>
</div>

<script type="text/javascript">
	//form添加验证
	$(document).ready(function() {
		$("#saveProjectTypeForm").validate();
	});
	
	function selectItem(){
		$("#unSelectedItems option:selected").each(function(){
			$("<option value='" + $(this).val() + "'>" + $(this).text() + "</option>").appendTo($("#selectedItems"));
			$(this).remove();
		});
	}

	function unSelectItem(){
		$("#selectedItems option:selected").each(function(){
			$("<option value='" + $(this).val() + "'>" + $(this).text() + "</option>").appendTo($("#unSelectedItems"));
			$(this).remove();
		});
	}

	function selectAll(){
		$("#selectedItems option").each(function(){
			$(this).attr("selected", "selected");
		});
	}
</script>
</body>
</html>